<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>plugins</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.js"></script>
</head>
<body>
  <div id="app"></div>
  <script>

    const Button = {
      name:'el-button',
      template: `
        <button @click="onClick">{{name}}</button>
      `,
      props:{
        name: {
          default: '按钮'
        }
      },
      methods:{
        onClick(){
          this.$emit('click')
        }
      }
    }

    const XUI = [
      Button
    ]

    XUI.install = (Vue, option) => {
      console.log(option)
      XUI.forEach(({name, ...component}) => {
        // console.log(name)
        // console.log(component)
        Vue.component(name, component)
      })
    }

    Vue.use(XUI,{abc:123},1111)

    new Vue({
      el:'#app',
      template: `
      <div>
        <div>hello world {{name}}</div>
        <el-button label="点我啊" @click="onClick"/>
      </div>
      `,
      data: {
        name: 'XXXX'
      },
      methods: {
        onClick(){
          console.log('按钮点击了啊')
        }
      },
    })

    var obj1= {
      a: 123,
      b:345
    }
    var obj2 = {
      a: 1111,
      c: 55
    }
    const obj = Object.assign(obj2,obj1)
    console.log(obj)
  </script>
</body>
</html>